<template>
	<view class="content">
		<view class="safeContent">
			<topCom>{{title}}</topCom>

		</view>
		<view class="steap">
			<view class="mintitle">
				<view class="mintitle_text">
					Step1：外部配置
				</view>
			</view>
			<view class="mintitle_nr">
				我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容
				我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是容我是内容我是内容我是内容我是
			</view>
			<view class="img">
				<img src="../../static/images/Home/content_img.png" alt="">
			</view>
		</view>
		<view class="steap">
			<view class="mintitle">
				<view class="mintitle_text">
					Step2：内部配置
				</view>
			</view>
			<view class="mintitle_nr">
				我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容
				我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是容我是内容我是内容我是内容我是
			</view>
			<view class="img">
				<img src="../../static/images/Home/content_img.png" alt="">
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import topCom from '../topCom/index.vue'
	import { ref } from 'vue'
	const title = ref('玩法中心')
</script>

<style lang="scss" scoped>
	.img {
		width: 622px;
		height: 240px;
		border-radius: 16px;
		border: 1px solid rgba(255, 255, 255, 0.3);
		margin: 0 auto;
		margin-top: 40px;

		img {
			width: 100%;
			height: 240px;
		}
	}

	.content {
		min-height: 100vh;
	}

	.safeContent {
		width: 100%;
		// display: flex;
		line-height: 88px;
		color: white;
		text-align: center;
		font-size: 36px;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
	}

	.title {
		height: 88px;
	}

	.steap {
		width: 686px;
		// height: 704px;
		padding-bottom: 20px;
		background: rgba(255, 255, 255, 0.1);
		border-radius: 24px;
		margin: 0 auto;
		margin-top: 32px;

		.mintitle {
			width: 335px;
			height: 80px;
			background: linear-gradient(90deg, rgba(0, 208, 185, 0.3) 0%, rgba(0, 208, 185, 0) 100%);
			border-radius: 24px;

			.mintitle_text {
				margin: 0 20px;
				font-size: 32px;
				font-family: PingFangSC, PingFang SC;
				font-weight: 600;
				color: #00D0B9;
				line-height: 80px;
			}
		}

		.mintitle_nr {
			width: 622px;
			font-size: 26px;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			line-height: 48px;
			margin: 0 auto;
		}

	}
</style>